<template>
  <view class="contentdata">
    <image class="b_img" mode="" src="../../static/my/BACK.png">
    </image>
    <view class="Head">
      <image mode="" src="../../static/my/head.png"></image>

      <view class="mark">
        <view>
          <text class="username">{{ userInfo.name }}-{{ userInfo.mobile }}</text>
        </view>
        <!-- <u-tag :text="userInfo.post == 'driver'?'驾驶员':'装卸员'" size="mini" success></u-tag> -->
		<image v-if="userInfo.post == 'driver'" class="sf-icon" src='../../static/my/jsy.png' mode=""></image>
		<image v-if="userInfo.post != 'driver'" class="sf-icon" src='../../static/my/zxy.png' mode=""></image>
      </view>
    </view>
    <view class="head_top">
      <view v-for="(item, index) in cards" :key="index" :index="index">
        <view class="flexmid-col itemMenu" style="background-color: #fff;" @click="toBasePath(item.path)">
          <image :mode="item.mode" :src="item.icon" style="width: 60rpx; height: 60rpx;"/>
          <view class="text">{{ item.title }}</view>
        </view>
      </view>
    </view>

  </view>
</template>

<script>
import {getCtUserInfo, toPath} from "@/utils/BaseUtils";

export default {
  data() {
    return {
      userInfo: {},
      cards: [
        {
          title: '手工记账',
          icon: '/static/my/sgjz.png',
          path: 'pages/mys/bookkeeping/index'
        },
        {
          title: '维修申请',
          icon: '/static/my/wxsq.png',
          path: 'pages/mys/vehicleRepair/index'
        },
        {
          title: '调休申请',
          icon: '/static/my/txsq.png',
          path: 'pages/mys/level/index'
        },
        {
          title: '在线学习',
          icon: '/static/my/zxxx.png',
          path: 'pages/mys/learn/index'
        },
        {
          title: '修改密码',
          icon: '/static/my/xgmm.png',
          path: 'pages/verify/edictpassword'
        },
        {
          title: '用户协议',
          icon: '/static/my/yhxy.png',
          path: 'pages/mys/agreement/userAgreement'
        },
        {
          title: '隐私政策',
          icon: '/static/my/yscl.png',
          path: 'pages/mys/agreement/privacyPolicy'
        },
        {
          title: '退出登录',
          icon: '/static/my/tcdl.png',
          path: 'pages/login/login'
        }
      ]
    }
  },
  onShow() {
    this.userInfo = getCtUserInfo();
  },
  methods: {
    toBasePath(url) {
      // 如果是退出登录 这里清空一下 缓存
      if ( (url||"").includes("login/login")) {
        uni.removeStorageSync('user_info');
        uni.removeStorageSync('token');
      }
      toPath(url);
    }
  },
}
</script>


<style lang="scss" scoped>

.contentdata {
  width: 100%;
  height: 100vh;
  background: white;
}
.text{
	margin-top: 10rpx;
	font-size: 26rpx;
}
.b_img {
  width: 100%;
  height: 374rpx;
}

.head_top {
  padding: 40rpx 20rpx;
  display: flex;
  flex-wrap: wrap;
  text-align: center;
  justify-content: space-around;
	.itemMenu{
		width: 172rpx;
		padding: 20rpx 0;
	}
}

.Head {

  position: absolute;
  top: 208rpx;
  display: flex;

  image {
    width: 110rpx;
    height: 110rpx;
    margin-left: 30rpx;
  }
}

.mark {
  width: 550rpx;
  line-height: 60rpx;
  margin-left: 20rpx;
  font-size: 26rpx;
  font-family: PingFang SC, PingFang SC-Regular;
  font-weight: Regular;

  color: #333333;
  .sf-icon{
	  width: 140rpx;
	  height: 64rpx;
	  margin-left: -15rpx !important;
	  margin-top: -10rpx;
  }
}

.username {
  font-size: 36rpx;
  font-family: PingFang SC, PingFang SC-Semibold;
  font-weight: bold;
  text-align: left;
  color: #3f4151;
  line-height: 56rpx;
}
</style>
